<template>z
  <div align="center">
    <h2>货主合同添加</h2><br>
    <table>
      <tr>
        <td>
          <el-form-item label="合同标题：" style="font-size: 20px;float: right;" prop="contracTitle">
            <el-input v-model="form.contracTitle" style="width: 300px;height: 40px;" placeholder="请输入合同标题" clearable />
          </el-form-item>
        </td>
        <td>
          <el-form-item label="货主单位：" style="font-size: 20px;float: right;">
            <el-input v-model="form.ownerUnit" style="width: 300px;height: 40px;" placeholder="请输入货主单位" clearable />
          </el-form-item>
        </td>
      </tr>
      <tr>
        <td>
          <el-form-item label="货主负责人：" style="font-size: 20px;float: right;">
            <el-input v-model="form.ownerName" style="width: 300px;height: 40px;" placeholder="请输入货主负责人" clearable />
          </el-form-item>
        </td>
        <td>
          <el-form-item label="线路：" style="font-size: 20px;float: right;">
            <el-select v-model="form.line" style="width: 300px;height: 40px;" clearable>
              <el-option v-for="item in lines" :key="item.lineId" :label="item.lineName" :value="item.lineName" />
            </el-select>
          </el-form-item>
        </td>
      </tr>
      <tr>
        <td>
          <el-form-item label="吨运价：" style="font-size: 20px;float: right;">
            <el-input v-model="form.freight" style="width: 300px;height: 40px;" placeholder="请输入吨运价" clearable />
          </el-form-item>
        </td>
        <td>
          <el-form-item label="包车条件吨位：" style="font-size: 20px;float: right;">
            <el-input v-model="form.tonnage" style="width: 300px;height: 40px;" placeholder="请输入包车条件吨位" clearable />
          </el-form-item>
        </td>
      </tr>
      <tr>
        <td>
          <el-form-item label="包车金额：" style="font-size: 20px;float: right;">
            <el-input v-model="form.charterAmount" style="width: 300px;height: 40px;" placeholder="请输入包车金额" clearable />
          </el-form-item>
        </td>
        <td>
          <el-form-item label="经办人：" style="font-size: 20px;float: right;">
            <el-input v-model="form.handlingName" style="width: 300px;height: 40px;" placeholder="请输入经办人" clearable />
          </el-form-item>
        </td>
      </tr>
      <tr>
        <td>
          <el-form-item label="签订时间：" style="font-size: 20px;float: right;">
            <el-date-picker v-model="form.signedTime" type="date" placeholder="请选择签订时间" clearable
              style="width: 300px;height: 40px;" value-format="YYYY-MM-DD" />
          </el-form-item>
        </td>
        <td>
          <el-form-item label="合同金额：" style="font-size: 20px;float: right;">
            <el-input v-model="form.contractAmount" style="width: 300px;height: 40px;" placeholder="请输入合同金额"
              clearable />
          </el-form-item>
        </td>
      </tr>
      <tr>
        <td colspan="2">
          <el-form-item label="合同标的或项目说明" style="font-size: 20px;width: 970px;height: 100px;float: right;">
            <el-input v-model="form.projectExplain" type="textarea"
              style="font-size: 20px;width: 970px;height: 100px;"></el-input>
          </el-form-item>
        </td>
      </tr>
      <tr>
        <td colspan="2">
          <el-form-item label="合同主要条款/边更条款" style="font-size: 20px;width: 970px;height: 100px;float: right;">
            <el-input v-model="form.projectArticle" type="textarea"
              style="font-size: 20px;width: 970px;height: 100px;"></el-input>
          </el-form-item>
        </td>
      </tr>
      <tr>
        <td style="font-size: 20px;">合同文本(附件)：</td>
        <td>
          <el-upload v-model:file-list="fileList" class="upload-demo" :on-success="hhh"
            action="http://47.96.140.177:8000/ContractRead/api/ReadContract/UpdateFile" :on-change="handleChange">
            <el-button type="primary" style="width: 150px;height: 50px;">选取文件</el-button>
            <template #tip>
              <span>（单个附件最大支持20M，支持：PDF、Word、Excel、Txt格式）</span>
            </template>
          </el-upload>
        </td>
      </tr>
    </table><br><br>
    <tr align="center">
      <el-button type="primary" @click="Approval" style="width: 150px;height: 50px;">提交审批</el-button>
      <el-button @click="Cancel()" style="width: 150px;height: 50px;">取消</el-button>
      <el-button type="primary" @click="onSubmit" style="width: 150px;height: 50px;">保存草稿</el-button>
    </tr>
  </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { onMounted, reactive, ref } from 'vue'

const form = reactive({
  contractNumber: 'HZ202010080122',
  contracTitle: '',
  ownerName: '',
  ownerUnit: '',
  line: '',
  signedTime: '',
  freight: '',
  tonnage: '',
  charterAmount: '',
  handlingName: '',
  contractAmount: '',
  projectExplain: '',
  projectArticle: '',
  contractFile: '',
  contractStatus: 0,
  classify: 2
})
import { ElMessage } from 'element-plus'
import router from '@/router';
//保存草稿
const onSubmit = () => {
  console.log(form);
  axios.post(`Contract/api/Contract/AddContracted`, form).then((ret) => {
    console.log(ret.data)
    if (ret.data.data == 1) {
      ContractedTrackRecord()
      ElMessage.success('货主添加成功')
      router.push('/OwnerList')
      return
    } else {
      ElMessage.error(ret.data.message)
    }
  })
}
onMounted(() => {
  GetAllline()
})
//线路
const lines: any = ref([])
const GetAllline = () => {
  axios.get('FoundationRead/api/Foundation/GetLine', {
    params: {
      pageIndex: 1,
      pageSize: 10
    }
  }).then((ret) => {
    console.log(ret.data.data)
    lines.value = ret.data.data.plist
  })
}
const fileList = ref([])
const hhh = (any: any) => {
  console.log(any)
  form.contractFile = any
}
//上传文件
const handleChange = () => {
  console.log(form.contractFile)
}
//取消
const Cancel = () => {
  router.push('/OpponentList')
}
//提交审批
const Approval = () => {
  form.contractStatus = 1
  axios.post(`Contract/api/Contract/AddContracted`, form).then((ret) => {
    console.log(ret.data)
    if (ret.data.data == 1) {
      ContractedTrackRecord()
      ElMessage.success('通用审批添加成功')
      router.push('/OwnerList')
      return
    } else {
      ElMessage.error(ret.data.message)
    }
  })
}

//跟踪记录（创建合同）
const TrackRecord = reactive({
  "contractNumber": "string",
  "header": "创建合同",
  "carrier": "string",
  "phone": "15939343226",
})
const ContractedTrackRecord = () => {
  TrackRecord.contractNumber = form.contractNumber
  TrackRecord.carrier = form.contractNumber

  axios.post(`Contract/api/TrackRecord/AddContractedTrackRecord`, TrackRecord).then((ret) => {
    console.log(ret.data)
  })
}

</script>

<style scoped></style>